/* 
 *  @module Tab View
 *  Author: Alex Hu
 *
 *  Example:
 *
 *
 */


'use strict';

GML.TabView = (function(){
    
    var T = {};

    T.init = function(){

        $(document).on('click', '[role=tab]', function(e){
            T.hunt($(this));
            e.preventDefault();
        });
    }

    T.hunt = function(el, init){
        var el = el
            , story = el.data('story')
            , $tab = el.closest('[role=tabMD]')
            , callback = el.data('callback')
            , that = T
            ;

        if(!story){
            var $label = el.parent().children()
                , $stage = $tab.children('[role=tabContent]')
                , $value = $stage.children()
                , index = el.index()
                , item, $item, map, cur, $tabCont, isCur, $cont
                ;

            if(!$stage.length){
                $stage = $('<div />', {
                    'role': 'tabContent'
                });
                $stage.appendTo($tab);
            }
            for(var i=0; i<$label.length; i++){
                item = $label[i];
                $item = $(item);
                if(i+1 === init){
                    $item.addClass('cur');
                }
                isCur = $item.hasClass('cur');

                if(item.nodeName === 'A'){
                    $tabCont = $('<div />', {
                        'class': 'cont clear hide',
                        'html': '<br /><br /><br />'
                    });
                    $tabCont.appendTo($stage);
                    $tabCont.data('loaded', -1);
                    if(isCur){
                        $tabCont.show();
                        that.ajax(item.href, $tabCont);
                    }
                }else{
                    $tabCont = $($value[i]);
                }
                story = {
                    'label': $item,
                    'content': $tabCont,
                    'index': i + 1
                }
                $item.data('story', story);
                if(isCur){
                    $tab.data('current', story);
                    cur = story;
                }
            }
            story = el.data('story');
        }else{
            cur = $tab.data('current');
        }

        if(!init){
            cur.label.removeClass('cur');
            if(cur.content.length){
                cur.content.hide();
            }
        }
        story.label.addClass('cur');
        $cont = story.content;
        if($cont.length){
            $cont.show();
            if($cont.data('loaded') - 1 < 0){
                that.ajax(story.label.attr('href'), $cont);
            }
        }
        $tab.data('current', story);

        if(callback){
            callback(el);
        }
    }

    T.ajax = function(href, $cont){
        $.ajax({
            url: href,
            beforeSend: function(){
                GML.Spinner($cont);
            },
            success: function(data){
                GML.Spinner($cont);
                $cont.html(data);
                $cont.data('loaded', 1);
            }
        });
    }

    T.init();
    return T;

})();

